<!DOCTYPE html>
<html lang="zh-Hans-CN">
<head>
  <% include("/include/header3.html",{"title":"开发-登录日志详情页"}){} %>
</head>
<body>

<div id="app">
  <div class="mainBox ">
    <div class="main-container layui-card">
      <div class="layui-card-body">
        <t-form v-loading="loading" colon label-width="120px">
           <t-row :gutter="[50,20]">
            <t-col :xs="12" :sm="6">
              <t-form-item label="登录类型">{{form.type}}</t-form-item>
            </t-col>
            <t-col :xs="12" :sm="6">
              <t-form-item label="用户标识">{{form.userId}}</t-form-item>
            </t-col>
            <t-col :xs="12" :sm="6">
              <t-form-item label="登录名称">{{form.account}}</t-form-item>
            </t-col>
            <t-col :xs="12" :sm="6">
              <t-form-item label="登录状态">{{parseStatus(form.status)}}</t-form-item>
            </t-col>
            <t-col :xs="12" :sm="6">
              <t-form-item label="登录时间">{{form.time}}</t-form-item>
            </t-col>
            <t-col :xs="12" :sm="6">
              <t-form-item label="登录地址">{{form.ipAddress}}</t-form-item>
            </t-col>
            <t-col :span="12">
              <t-form-item label="登录描述">{{form.msg}}</t-form-item>
            </t-col>
          </t-row>
        </t-form>
      </div>
    </div>
  </div>
  <div class="bottom">
    <t-space class="button-container ">
      <t-button theme="warning" @click="closeBtn.close"><i class="layui-icon mr-5 text-size-14" :class="closeBtn.i"></i>{{closeBtn.t}}</t-button>
    </t-space>
  </div>
</div>

<script>
  const PATH_URL = "dev/loginLog/";
</script>

<script>

  setupVue("#app", {
    setup() {
      // 表单相关
      const loading = Vue.ref(false);
      const form = Vue.ref({});
      // 获取表单数据
      const getForm = (id) => req(axiosGet, PATH_URL + "getInfo", { id }, (res) => {
        if (res.code === 200) {
          form.value = res.data;
        } else {
          $baseAlert(res.msg, () => closeBtn.value.close());
        }
      }, loading);
      const LyData = getLayerData();
      if (LyData && LyData.id) getForm(LyData.id);
      else {
        $baseAlert("参数错误", () => closeBtn.value.close());
      }

      // 状态选项
      const statusOptions = [{ label: "登录成功", value: 1 }, { label: "登录失败", value: 0 }];

      const parseStatus = (status) => {
        const obj = statusOptions.find(item => item.value === status);
        if (obj) return obj.label;
        else return "未知"
      }

      const closeBtn = useCloseBtn();
      return {
        closeBtn, loading, form, parseStatus,
      }

    },
  });
</script>


</body>
</html>
